<template>
  <div>
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>用户管理</el-breadcrumb-item>
      <el-breadcrumb-item>用户列表</el-breadcrumb-item>
    </el-breadcrumb>
     <el-card>
          <el-table
              :data="productList"
              stripe
              border
              style="width: 100%">
              <el-table-column
                  prop="nickname"
                  label="账号">
              </el-table-column>
              <el-table-column
                  prop="username"
                  label="用户名">
              </el-table-column>
              <el-table-column
                  prop="tall"
                  label="身高">
              </el-table-column>
              <el-table-column
                  prop="weight"
                  label="体重">
              </el-table-column>
            <el-table-column
                  prop="sex"
                  label="性别">
                   <template slot-scope="scope">
                    <div>
                        {{scope.row.sex == 1?"男":scope.row.sex == 2?"女":"保密"}}
                    </div>
                  </template>
              </el-table-column>
              <el-table-column
                  prop="birthday"
                  label="出生日期">
              </el-table-column>
            <el-table-column
                  prop="vips"
                  label="持有vip卡数量（张）">
              </el-table-column>
            <el-table-column
                  prop="coupons"
                  label="持有优惠券数量（张）">
              </el-table-column>
            <el-table-column
                  prop="orders"
                  label="总订单数">
                  <template slot-scope="scope">
                    <div>
                        {{scope.row.orders.length}}
                    </div>
                  </template>
              </el-table-column>
          </el-table>
      </el-card>
    </div>
</template>

<script>
export default {
    data(){
        return{
            productList:[],
        }
    },
    async created(){
        this.getComputed()
    },
    methods:{
      async getComputed(){
          const { data } = await this.$http.get('venue/manage/users')
          if (data.state !== 0) {
          return this.$message.error(data.msg)
          }
          this.productList = data.result
          console.log(this.productList)
      },
    }
}
</script>

<style scoped>
    .add{
        display: flex;
        justify-content: flex-end;
    }
    .add .el-button{
        margin-bottom: 10px;
    }
</style>